<!DOCTYPE html>
<html lang="zh-CN">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>安装成功</title>
	<style>
		body {
			background: linear-gradient(135deg, #f6f9fc 0%, #dfe6e9 100%);
			display: flex;
			justify-content: center;
			align-items: center;
			min-height: 100vh;
			margin: 0;
			font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
			padding: 15px;
		}

		.main-container {
			background-color: #fff;
			padding: 25px;
			border-radius: 16px;
			box-shadow: 0 15px 40px rgba(0, 0, 0, 0.08);
			width: 600px;
			max-width: 95%;
			position: relative;
			overflow: hidden;
		}

		.main-container::before {
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			height: 3px;
			background: linear-gradient(90deg, #4481eb, #04befe);
		}

		.title {
			font-size: 24px;
			font-weight: 600;
			margin-bottom: 25px;
			text-align: center;
			color: #2c3e50;
		}

		.item {
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 12px 16px;
			margin: 8px 0;
			border-radius: 8px;
			background-color: #f8fafc;
			transition: all 0.2s ease;
			border: 1px solid rgba(0, 0, 0, 0.03);
		}

		.item:hover {
			background-color: #fff;
			transform: translateX(5px);
			box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
		}

		.label {
			font-size: 14px;
			color: #2c3e50;
			font-weight: 500;
		}

		.value {
			font-size: 14px;
			color: #34495e;
			display: flex;
			align-items: center;
			gap: 8px;
		}

		.check-icon {
			display: inline-flex;
			align-items: center;
			justify-content: center;
			width: 20px;
			height: 20px;
			border-radius: 50%;
			font-size: 12px;
		}

		.check-icon-success {
			background-color: rgba(0, 184, 148, 0.1);
			color: #00b894;
		}

		.check-icon-error {
			background-color: rgba(255, 118, 117, 0.1);
			color: #ff7675;
		}

		.inner-table {
			border-collapse: separate;
			border-spacing: 4px;
		}

		.inner-table td {
			padding: 6px 10px;
			background: rgba(255, 255, 255, 0.6);
			border-radius: 4px;
			font-size: 13px;
		}

		.btn-container {
			display: flex;
			gap: 12px;
			margin-top: 25px;
		}

		.btn {
			flex: 1;
			background: linear-gradient(90deg, #4481eb, #04befe);
			color: #fff;
			border: none;
			border-radius: 8px;
			padding: 10px 20px;
			font-size: 14px;
			cursor: pointer;
			transition: all 0.2s ease;
			font-weight: 500;
		}

		.btn:hover {
			transform: translateY(-2px);
			box-shadow: 0 4px 12px rgba(68, 129, 235, 0.25);
		}

		#prev-step {
			background: linear-gradient(90deg, #a8c0ff, #3f2b96);
		}

		@media (max-width: 480px) {
			.main-container {
				padding: 20px 15px;
			}

			.title {
				font-size: 20px;
				margin-bottom: 20px;
			}

			.item {
				padding: 10px;
				margin: 6px 0;
			}

			.btn-container {
				flex-direction: column;
			}

			.btn {
				width: 100%;
			}
		}
	</style>
	<link rel="stylesheet" href="/static/component/layui/css/layui.css">
	<link rel="stylesheet" href="/static/css/install.css">
	<script src="/static/component/layui/layui.js"></script>
</head>

<body>
	<div class="main-container">
		<div class="title">安装成功</div>
					<div class="layui-install">
						<div class="tips">正在安装，请勿刷新...</div>
					</div>
					<div class="layui-complete" style="display: none">
						<div class="layui-success">YPay安装成功</div>
						<blockquote class="layui-elem-quote layui-text" style="border-left: 0px;text-align: left;margin-bottom: 30px;">
						  1. <a href="/" target="_blank">请不要将后台地址泄露给他人，如有泄露请及时修改</a><br/>
						  2. <a href="/" target="_blank" class="layui-admin">后台地址：</a><br>
						</blockquote>
						<a href="/" target="_blank" class="layui-btn layui-btn-normal layui-btn-fixed">访问前台</a>
						<a href="/" target="_blank" class="layui-btn layui-btn-normal layui-btn-admin">访问后台</a>
					</div>
	</div>
	<script type="text/javascript">
		layui.use(['jquery', 'layer', 'element'], function () {
			var layer = layui.layer;
			var jquery = layui.jquery;

			// 加载数据信息
			jquery.get('/install.php/index/install', {}, function (res) {
				if (res.code === 200) {
					jquery('.layui-install').remove();
					var admin = jquery('.layui-admin');
					admin.attr('href', '/admin.php');
					admin.html('后台地址：http://' + location.host + '/admin.php');
					jquery('.layui-btn-admin').attr('href', '/admin.php');
					jquery('.layui-complete').show();
				} else {
					layer.msg(res.msg, { icon: 5 });
				}
			});
		})
	</script>
</body>

</html>